<template>
	<view class="classify-layout gradient-background">
		<custom-navbar title="分类"></custom-navbar>
		<view class="content gradient-background">
			<theme-item class="theme-item" v-for="item in classifyImageList" :key="item._id" :obj="item"></theme-item>
		</view>
	</view>
</template>

<script setup>
import { reactive,ref } from 'vue';
import { apiGetClassifyImg } from "@/apis.js"
	var classifyImageList=ref([]);
	async function getClassifyImage(){
		var Data=await apiGetClassifyImg();
		classifyImageList.value=Data.data.data;
		console.log(classifyImageList);
	}
	getClassifyImage();
</script> 

<style lang="scss" scoped>
	.classify-layout{
		display: flex;
		flex-direction: column;
		align-items: center;
		z-index: 1;
	}
	button{
		margin-top: 190rpx;
	}
	.content{
		margin: 200rpx 0;
		padding: 0 30rpx;
		display: grid;
		grid-template-columns: repeat(3,1fr);
		gap: 16rpx;
		z-index: 0;
	}
</style>
